<!-- 添加销售订单 -->
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>添加销售订单</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="stylesheet" href="/lib/layui-v2.6.8/css/layui.css" media="all" />
    <link rel="stylesheet" href="/css/public.css" media="all" />
    <style>
        body {
            background-color: #ffffff;
        }

        .layui-elem-quote {
            padding: 10px;
            border-left: 5px solid #009688;
        }

        fieldset legend {
            margin-bottom: 16px;
        }

        .layui-input-block {
            margin-right: 15px;
        }
    </style>
</head>

<body>
    <!-- <blockquote class="layui-elem-quote layui-text">请先选择客户姓名（点新增客户可快速创建客户再选择），订单条目以及收款记录信息在下方表格填写</blockquote> -->
    <fieldset class="layui-elem-field">
        <legend>
            <span id="showOrderNo" style="color: rgba(255, 87, 34, 1);"></span>
        </legend>
        <div class="layui-form layuimini-form" lay-filter="addForm">
            <!-- 要修改的主键ID -->
            <input type="hidden" id="id" name="id" value="" />
            <input type="hidden" id="orderNo" name="orderNo" value="" />
            <!-- 表单字段 -->
            <div class="layui-form-item">
                <label class="layui-form-label required">客户名称</label>
                <div class="layui-input-inline">
                    <!-- 选择的下单客户ID保存到这里 -->
                    <input class="layui-hide" type="hidden" name="customerId" />
                    <!-- <input class="layui-hide" type="hidden" name="customerMobile" /> -->
                    <!-- <input class="layui-hide" type="hidden" name="customerWechat" /> -->
                    <input type="text" id="customerLinkman" name="customerLinkman" lay-verify="required" placeholder="请选择" autocomplete="off" class="layui-input" />
                </div>
                <label class="layui-form-label">手机</label>
                <div class="layui-input-inline">
                    <input type="text" id="customerMobile" name="customerMobile" placeholder="" value="" class="layui-input" />
                </div>
                <label class="layui-form-label">微信</label>
                <div class="layui-input-inline">
                    <input type="text" id="customerWechat" name="customerWechat" placeholder="" value="" class="layui-input" />
                </div>
                <div style="text-align: right; margin-right: 15px;">
                    <button class="layui-btn layui-btn-normal" id="addCustomer"><i class="layui-icon"></i>保存客户</button>
                </div>
            </div>
            <br>
            <hr>
            <br>
            <!-- Tab页展示条目列表 -->
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">订单条目</li>
                </ul>
                <div class="layui-tab-content">
                    <!-- 第1个Tab页 layui-show表示显示 -->
                    <div class="layui-tab-item layui-show">
                        <!-- 公共操作栏 -->
                        <script type="text/html" id="toolbarGlobal1">
                            <div class="layui-btn-container">
                                <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="add">
                                    <i class="layui-icon"></i>
                                    添加
                                </button>
                                <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete">
                                    <i class="layui-icon"></i>
                                    删除
                                </button>
                                <button class="layui-btn layui-btn-sm layui-btn-warm data-add-btn" lay-event="addPurchase">
                                    <i class="layui-icon"></i>
                                    一键生成采购单
                                </button>
                            </div>
                        </script>
                        <!-- 表格数据显示 -->
                        <table class="layui-hide" id="currentTable1" lay-filter="currentTableFilter1"></table>
                        <!-- 表格中的操作栏 -->
                        <script type="text/html" id="currentTableBar1">
                            <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">
                                <i class="layui-icon"></i>
                                编辑
                            </a>
                            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">
                                <i class="layui-icon"></i>
                                删除
                            </a>
                        </script>
                        <!-- 表格内下拉选择 -->
                        <!-- <script type="text/html" id="tpl-dropdpwn-colour">
                            <button class="layui-btn layui-btn-primary dropdpwn-colour" style="height: 26px; line-height: 26px;">
                                <span>{{= d.colour || '选择'}}</span>
                                <i class="layui-icon layui-icon-down layui-font-12"></i>
                            </button>
                        </script> -->
                    </div>
                </div>
            </div>

            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">收款记录</li>
                </ul>
                <div class="layui-tab-content">
                    <!-- 第2个Tab页 layui-show表示显示 -->
                    <div class="layui-tab-item layui-show">
                        <!-- 公共操作栏 -->
                        <script type="text/html" id="toolbarGlobal2">
                            <div class="layui-btn-container">
                                <button class="layui-btn layui-btn-sm layui-btn-normal data-add-btn" lay-event="add">
                                    <i class="layui-icon"></i>
                                    添加
                                </button>
                                <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete">
                                    <i class="layui-icon"></i>
                                    删除
                                </button>
                            </div>
                        </script>
                        <!-- 表格数据显示 -->
                        <table class="layui-hide" id="currentTable2" lay-filter="currentTableFilter2"></table>
                        <!-- 表格中的操作栏 -->
                        <script type="text/html" id="currentTableBar2">
                            <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">
                                <i class="layui-icon"></i>
                                编辑
                            </a>
                            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">
                                <i class="layui-icon"></i>
                                删除
                            </a>
                        </script>
                    </div>
                </div>
            </div>
            <hr class="layui-border-orange">
            <br>
            <!-- 自动计算订单金额 -->
            <div class="layui-form-item">

                <label class="layui-form-label">订单状态</label>
                <div class="layui-input-inline">
                    <!-- <select id="status" name="status" lay-verify="required" lay-search lay-filter="payStatus">
                        <option value="">请选择</option>
                        <option value="0" selected>处理中</option>
                        <option value="1">已完成</option>
                    </select> -->
                    <button type="button" class="layui-btn layui-btn-fluid" style="background-color: #31bdec;">新订单</button>
                </div>
                <label class="layui-form-label">收款状态</label>
                <div class="layui-input-inline">
                    <!-- <select id="payStatus" name="payStatus" lay-verify="required" lay-search lay-filter="payStatus">
                        <option value="">请选择</option>
                        <option value="0" selected>未收款</option>
                        <option value="1">全部收款</option>
                        <option value="2">部分收款</option>
                    </select> -->
                    <button type="button" class="layui-btn layui-btn-fluid" style="background-color: #31bdec;">未收款</button>
                </div>
                <label class="layui-form-label">订单金额</label>
                <div class="layui-input-inline">
                    <h2 id="orderCost" style="line-height: 38px; color: rgba(255, 87, 34, 1);">￥0.00</h2>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">应收金额</label>
                <div class="layui-input-inline">
                    <input type="text" id="receivableCost" name="receivableCost" lay-verify="required|number" lay-reqtext="打折抹零后的应收款" placeholder="￥" value="" class="layui-input" />
                </div>
                <label class="layui-form-label">实收金额</label>
                <div class="layui-input-inline">
                    <h2 id="receivedCost" style="line-height: 38px; color: rgba(255, 87, 34, 1);">￥0.00</h2>
                </div>
                <label class="layui-form-label">余款</label>
                <div class="layui-input-inline">
                    <h2 id="residueCost" style="line-height: 38px; color: rgba(255, 87, 34, 1);">￥0.00</h2>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">下单时间</label>
                <div class="layui-input-block">
                    <input type="text" id="orderTime" name="orderTime" lay-verify="required" lay-reqtext="下单时间" value="" class="layui-input" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <textarea id="remark" name="remark" placeholder="请输入" value="" class="layui-textarea"></textarea>
                </div>
            </div>

            <!-- 确认保存按钮 -->
            <div class="layui-form-item">
                <div class="layui-input-block" style="text-align: right;">
                    <button class="layui-btn layui-btn-primary layui-layer-close1" id="cancel">取消</button>
                    <button class="layui-btn" lay-submit lay-filter="saveBtn" id="submit"><i class="layui-icon"></i>确认保存</button>
                </div>
            </div>
        </div>
    </fieldset>

    <!-- 后端接口定义 -->
    <script src="/js/api-route.js"></script>
    <!-- 系统通用JS库 -->
    <script src="/js/pro-module/common.js"></script>
    <!-- 页面事件处理 -->
    <script src="/lib/layui-v2.6.8/layui.js" charset="utf-8"></script>
    <!-- 引入模块配置 -->
    <script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
    <script>
        layui.use(['jquery', 'layer', 'form', 'table', 'dropdown', 'tableSelect'], function () {
            var $ = layui.jquery,
                layer = layui.layer,
                form = layui.form,
                table = layui.table,
                laydate = layui.laydate,
                dropdown = layui.dropdown,
                tableSelect = layui.tableSelect;

            // 新增数据ID
            var p_id = -1;

            // 给时间框绑定时间控件
            laydate.render({
                elem: '#orderTime',
                type: 'datetime',
                trigger: 'mousedown',
                value: new Date()
            });

            // 选择列表中的内容
            tableSelect.render({
                elem: '#customerLinkman', // 定义输入框input对象（必填）
                checkedKey: 'id', // 表格的唯一键值，非常重要，影响到选中状态（必填）
                searchKey: 'keyword', // 搜索输入框的name值（默认keyword）
                searchPlaceholder: '搜索老客户', // 搜索输入框的提示文字（默认关键词搜索）
                table: { // 定义表格参数，与LayUI的Table模块一致，只是无需再定义表格elem
                    url: $api.customer.pagelist, // 数据接口地址
                    request: {
                        // 处理接口中分页参数名称
                        pageName: 'pageNo', // 修改默认的分页参数，指定第几页参数pageName的名称
                        limitName: 'pageSize', // 修改默认的分页参数，指定每页多少数据参数limitName的名称
                    },
                    cols: [
                        [ // 绑定字段
                            {
                                type: 'radio', // 单选按钮
                                width: 50, // 自定义宽度
                            },
                            {
                                type: 'numbers', // 自增序号列
                                width: 80, // 自定义宽度
                                title: '序号', // 表头标题
                            },
                            {
                                field: 'linkman',
                                width: 120,
                                title: '联系人',
                            },
                            {
                                field: 'mobile',
                                width: 160,
                                title: '手机号',
                            },
                            {
                                field: 'wechat',
                                width: 120,
                                title: '微信',
                            },
                        ]
                    ]
                },
                done: function (elem, data) {
                    // 选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据[]
                    // 拿到data[]后按照业务需求做想做的事情（例如：加个隐藏域放ID）
                    var selectID = [];
                    var selectName = [];
                    var selectMobile = [];
                    var selectWechat = [];
                    // var selectInfo = [];
                    layui.each(data.data, function (index, item) {
                        selectID.push(item.id);
                        selectName.push(item.linkman);
                        selectMobile.push(item.mobile);
                        selectWechat.push(item.wechat);
                        // selectInfo.push(item.wechat + '（' + item.mobile + '）');
                    });
                    elem.val(selectName.join(','));
                    // 将返回的数据保存到表单的隐藏域
                    // layer.msg('ID: ' + selectID.join(' ,'), { icon: 1 });
                    $('input[name=customerId]').val(selectID.join(','));
                    $('input[name=customerMobile]').val(selectMobile.join(','));
                    $('input[name=customerWechat]').val(selectWechat.join(','));
                    // $('#customerInfo').html(selectInfo.join(','));
                }
            });

            // 从数据库中获取配置
            var system_prefix = 'YJ'; // 订单前缀
            // 获取全局订单前缀配置
            $.ajax({
                url: $api.baseconfig.pagelist,
                type: 'GET',
                data: {
                    pageNo: 1,
                    pageSize: 1,
                    name: 'system_prefix'
                },
                dataType: 'JSON',
                async: false, // 使用同步请求
                // contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                success: function (res) {
                    if (res.code == 0) {
                        if (res.count == 1) {
                            system_prefix = res.data[0].val;
                        }
                    }
                },
                error: function (res) {
                    layer.msg('服务器开小差了', {
                        offset: '15px',
                        icon: 2,
                        time: 1500,
                    });
                },
            });

            // 生成订单编号
            var date = new Date();
            date.setMinutes(date.getMinutes() - date.getTimezoneOffset()); // 时区补偿
            var gen_order_no = system_prefix + date.toJSON().substr(0, 16).replace(/[-:T]/g, ''); // 202307030829

            // 表单初始化赋值，如果表单初始化加载不成功，添加如下代码：form.render();
            form.val('addForm', {
                'orderNo': gen_order_no, // 生成订单编号
                'orderCost': '0', // 订单金额
                'receivableCost': '0', // 应收金额
                'receivedCost': '0', // 实收金额
                'residueCost': '0', // 未结金额
            });
            // 显示订单编号
            $('#showOrderNo').html(gen_order_no);

            // 点击添加客户按钮
            $('#addCustomer').click(function () {
                // 打开添加客户页面
                var index = layer.open({
                    id: 'addCustomerPage', // 定义ID防止重复弹出
                    title: '添加新客户', // 页面标题
                    type: 2, // 页面类型
                    shade: 0.2, // 遮罩背景透明度
                    maxmin: false, // 不显示最大化最小化按钮
                    shadeClose: true, // 显示关闭按钮
                    area: ['60%', '90%'], // 填充尺寸
                    content: '/page/customer/add.html', // 打开的页面
                });
            });

            // lay-verify设置验证规则，多个用"|"分割，默认规则有：required(必填项) phone(手机号) email(邮箱) url(网址) number(数字) date(日期) identity(身份证)
            // 自定义验证规则，例如：lay-verify="required|name"
            // form.verify({
            // });

            // 监听提交
            form.on('submit(saveBtn)', function (data) {
                // Ajax提交数据到后台
                $.ajax({
                    url: $api.ordersales.save,
                    type: 'POST',
                    data: JSON.stringify(data.field), // 将对象转换为JSON字符串传递
                    dataType: 'JSON',
                    contentType: 'application/json', // 指定请求方式为JSON
                    // headers: {
                    //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                    // },
                    success: function (res) {
                        if (res.code == 0) {
                            // 添加数据成功，将ID保存
                            p_id = res.data.id; // 将新增后返回对象的ID保存在p_id变量，用于传递到添加详情页面
                            $('#id').val(res.data.id); // 添加后保存ID，以便后续更新数据

                            layer.msg('数据已保存', {
                                icon: 6
                            });
                            parent.layui.table.reload('currentTable', {
                                page: {
                                    curr: 1
                                }
                            });
                        } else {
                            layer.msg('保存失败', {
                                icon: 5
                            });
                        }
                    },
                    error: function (res) {
                        layer.msg('服务器开小差了', {
                            offset: '15px',
                            icon: 2,
                            time: 1500,
                        });
                    }
                });
            });

            // 点击取消按钮
            $('#cancel').click(function () {
                // 关闭当前弹出页面
                window.parent.layer.closeAll();
                return false;
            });

            /* **************** 销售订单条目数据 **************** */

            // 表格1数据绑定
            table.render({
                elem: '#currentTable1', // 绑定到元素
                url: $api.ordersalesentry.pagelist, // 后端分页查询接口地址
                // contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                where: {
                    type: p_id // 将新添加的主ID作为条件关联查询
                }, // 查询的条件（可用Q请求参数类进行封装）
                request: {
                    // 处理接口中分页参数名称
                    pageName: 'pageNo', // 修改默认的分页参数，指定第几页参数pageName的名称
                    limitName: 'pageSize', // 修改默认的分页参数，指定每页多少数据参数limitName的名称
                },
                toolbar: '#toolbarGlobal1', // 表格上面的公共工具栏
                defaultToolbar: ['filter', 'exports', 'print'], // 默认的工具栏
                cols: [
                    [ // 绑定字段
                        {
                            type: 'checkbox', // 批量选择复选框
                            width: 50, // 自定义宽度
                        },
                        {
                            type: 'numbers', // 自增序号列
                            width: 80, // 自定义宽度
                            title: '序号', // 表头标题
                        },
                        {
                            field: 'productName',
                            width: 120,
                            title: '产品',
                        },
                        {
                            field: 'colour',
                            width: 120,
                            title: '颜色',
                            // templet: '#tpl-dropdpwn-colour', // 表格内下拉选择
                        },
                        {
                            field: 'model',
                            width: 80,
                            title: '型号',
                            templet: function (data) {
                                // 如果productModelId=0则显示空
                                return data.productModelId == 0 ? '' : data.model;
                            },
                        },
                        {
                            field: 'price',
                            width: 80,
                            title: '单价',
                            templet: function (data) {
                                return moneyFormat(data.price);
                            },
                        },
                        {
                            field: 'number',
                            width: 100,
                            title: '数量',
                            edit: 'text',
                        },
                        {
                            field: 'unit',
                            width: 80,
                            title: '单位',
                        },
                        {
                            field: 'orderCost',
                            width: 100,
                            title: '金额',
                            templet: function (data) {
                                return moneyFormat(data.orderCost);
                            },
                        },
                        {
                            field: 'remark',
                            title: '备注',
                            edit: 'text',
                        },
                        {
                            title: '操作',
                            width: 180,
                            toolbar: '#currentTableBar1',
                            align: 'center',
                        },
                    ],
                ],
                done: function (res, curr, count) {
                    console.log('--done--', res, curr, count);

                    // 添加完销售条目加载列表时计算总金额
                    var order_cost_value = 0; // 条目总金额
                    if (res.code == 0) {
                        $(res.data).each(function () {
                            order_cost_value += this.orderCost;
                        });
                    }
                    if (p_id != -1 && $('#orderCost').val() != order_cost_value) {
                        $('#orderCost').val(numberFormat(order_cost_value));
                        $('#residueCost').val(numberFormat(order_cost_value));
                        $('#submit').click(); // 手动提交主表单
                    }

                    form.render(); // 刷新表格分页显示数据

                    // 表格内下拉选择（获取当前行数据）
                    // var options = this;
                    // table.getRowData = function (elem) {
                    //     var index = $(elem).closest('tr').data('index');
                    //     return table.cache[options.id][index] || {};
                    // };
                    // 表格内下拉选择（DropDown方式的下拉选择）
                    // dropdown.render({
                    //     elem: '.dropdpwn-colour',
                    //     // trigger: 'hover',
                    //     // 此处的 data 值，可根据 done 返回的 res 遍历来赋值
                    //     data: [{
                    //         title: '黑色',
                    //         id: 101
                    //     }, {
                    //         title: '白色',
                    //         id: 102
                    //     }, {
                    //         title: '其他',
                    //         id: 103
                    //     }],
                    //     click: function (obj) {
                    //         var data = table.getRowData(this.elem); // 获取当前行数据(如 id 等字段，以作为数据修改的索引)
                    //         this.elem.find('span').html(obj.title);
                    //         // 更新数据中对应的字段
                    //         data.sex = obj.title;
                    //         // 显示 - 仅用于演示
                    //         layer.msg('选中值: ' + obj.title + '<br>当前行数据：' + JSON.stringify(data));
                    //     }
                    // });
                },
                limits: [10, 20, 50, 120],
                limit: 10,
                page: false,
                skin: 'line',
            });

            /**
             * 表格编辑 edit是固定事件名，currentTableFilter是table原始容器的属性lay-filter对应的值
             */
            table.on('edit(currentTableFilter1)', function (obj) {
                // console.log(layui.table.cache["currentTable1"]); // 整个表格的所有数据
                // console.log(obj.value); // 得到修改后的值
                // console.log(obj.field); // 当前编辑的字段名
                console.log(obj.data); // 所在行的所有相关数据

                // 验证输入内容的合法性
                var old_value = $(obj.tr.find('[data-field=' + obj.field + ']')).text(); // 获取修改前字段对应的值
                if (obj.field == 'number') { // 验证字段
                    if (obj.value.length == 0) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            number: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('值不能为空', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                    var reg = /^[1-9]\d*$/; // 非零的正整数
                    if (!reg.test(obj.value)) {
                        obj.tr.find('td[data-field=' + obj.field + '] input').val(old_value); // 还原页面显示的值
                        obj.update({
                            number: old_value
                        }); // 还原表格数据缓存的值
                        layer.msg('值为非零的正整数', {
                            icon: 2,
                            time: 1500,
                        });
                        return false; // 验证失败，阻断后续操作
                    }
                    // 1 = 6 / (3 * 2 * 1)
                    var order_cost_value = $(obj.tr.find('[data-field=orderCost]')).text();
                    var coefficient = order_cost_value / (obj.data.model * obj.data.price * old_value);

                    var costs = obj.data.model * obj.data.price * obj.value * coefficient;
                    obj.tr.find('td[data-field=orderCost] div').html(moneyFormat(costs));

                    var stocks = '<span style="padding:5px;background-color:' + (obj.data.stock >= obj.value ? '#C5F5DC;' : '#F58E8A;') + '">' + obj.data.stock + '</span>';
                    obj.tr.find('td[data-field=stock] div').html(stocks);

                    var now_cost = Number.parseFloat($('#orderCost').val());
                    now_cost = now_cost + (costs - order_cost_value); // 重新计算总金额

                    obj.data.costs = costs; // 修改所在行受影响的数据
                    $('#orderCost').val(numberFormat(now_cost));
                    $('#residueCost').val(numberFormat(now_cost));
                    if (p_id != -1) {
                        $('#submit').click(); // 手动提交主表单
                    }
                }

                // Ajax提交数据到后台
                $.ajax({
                    url: $api.ordersalesentry.update,
                    type: 'POST',
                    data: JSON.stringify(obj.data), // 将对象转换为JSON字符串传递
                    dataType: 'JSON',
                    contentType: 'application/json', // 指定请求方式为JSON
                    // headers: {
                    //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                    // },
                    success: function (res) {
                        if (res.code == 0) {
                            layer.msg('数据已更新', {
                                icon: 1,
                                time: 1000,
                            });
                        } else {
                            layer.msg('数据更新失败', {
                                icon: 2,
                                time: 1500,
                            });
                        }
                    },
                    error: function (res) {
                        layer.msg('数据更新失败', {
                            icon: 2,
                            time: 1500,
                        });
                    }
                });
            });

            /**
             * 弹出层[添加][删除]等监听事件
             */
            table.on('toolbar(currentTableFilter1)', function (obj) {
                // 如果没有保存主数据则不允许点击添加或删除按钮
                if (p_id == -1) {
                    layer.msg('请先保存销售订单', {
                        icon: 5,
                        time: 1500,
                    });
                    return false;
                }
                if (obj.event === 'add') {
                    // 监听添加操作，与lay-event="add"对应
                    var index = layer.open({
                        id: 'addPage1', // 定义ID防止重复弹出
                        title: '添加销售订单条目', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/order_sales_entry/add.html?pid=' + p_id, // 打开的页面
                    });
                } else if (obj.event === 'delete') {
                    // 监听批量删除操作，与lay-event="delete"对应
                    var checkStatus = table.checkStatus('currentTable1');
                    var data = checkStatus.data;
                    var ids = []; // 需要删除的ID数组
                    for (let i = 0; i < data.length; i++) {
                        ids[i] = data[i].id;
                    }
                    if (ids.length == 0) {
                        return false; // 未选中任何行
                    }
                    // Ajax调用后端接口批量删除数据
                    layer.confirm('真的批量删除么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.ordersalesentry.remove, // 后端批量删除接口地址 
                            type: 'POST',
                            data: JSON.stringify(ids), // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            contentType: 'application/json', // 指定请求方式为JSON 
                            // headers: {
                            //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token） 
                            // },
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            }
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable1', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.ordersalesentry.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                } else if (obj.event === 'addPurchase') {
                    // 监听添加操作，与lay-event="add"对应
                    var index = layer.open({
                        id: 'addPurchasePage1', // 定义ID防止重复弹出
                        title: '添加采购订单', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['100%', '100%'], // 填充尺寸
                        content: '/page/order_purchase/add.html?pid=' + p_id, // 打开的页面
                    });

                    // 打开新的窗口
                    // miniTab.openNewTabByIframe({
                    //      href: '/page/order_purchase/add.html?pid=' + p_id,
                    //     title: '添加采购订单',
                    // });
                }
            });

            // 点击编辑按钮
            table.on('tool(currentTableFilter1)', function (obj) {
                var data = obj.data;
                if (obj.event === 'edit') {
                    var index = layer.open({
                        id: 'editPage1', // 定义ID防止重复弹出
                        title: '编辑销售订单条目', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/order_sales_entry/edit.html?id=' + data.id, // 打开的页面
                        // success: function (layero, index) {
                        //     // 加载动画
                        //     layer.load(2, {
                        //         time: 10, // 持续时间10毫秒
                        //         shade: false,
                        //     });
                        // }
                    });
                    // 当调整浏览器窗口大小时重新设置全屏
                    // $(window).on('resize', function () {
                    //     layer.full(index); // 全屏显示
                    // });
                    // layer.full(index); // 默认全屏显示
                    return false;
                } else if (obj.event === 'delete') {
                    layer.confirm('真的删除行么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.ordersalesentry.delete, // 后端删除接口地址 
                            type: 'POST',
                            data: 'id=' + data.id, // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            },
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable1', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.ordersalesentry.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });

            /* **************** 销售订单收款记录数据 **************** */

            // 表格2数据绑定
            table.render({
                elem: '#currentTable2', // 绑定到元素
                // url: $api.ordersalesreceipt.pagelist, // 后端分页查询接口地址
                // contentType: 'application/json', // 指定请求方式为JSON
                // headers: {
                //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token）
                // },
                // where: {
                //     type: p_id // 将新添加的主ID作为条件关联查询
                // }, // 查询的条件（可用Q请求参数类进行封装）
                // request: {
                //     // 处理接口中分页参数名称
                //     pageName: 'pageNo', // 修改默认的分页参数，指定第几页参数pageName的名称
                //     limitName: 'pageSize', // 修改默认的分页参数，指定每页多少数据参数limitName的名称
                // },
                toolbar: '#toolbarGlobal2', // 表格上面的公共工具栏
                defaultToolbar: ['filter', 'exports', 'print'], // 默认的工具栏
                cols: [
                    [ // 绑定字段
                        {
                            type: 'checkbox', // 批量选择复选框
                            width: 50, // 自定义宽度
                        },
                        {
                            type: 'numbers', // 自增序号列
                            width: 80, // 自定义宽度
                            title: '序号', // 表头标题
                        },
                        {
                            field: 'money',
                            width: 120,
                            title: '金额',
                            edit: 'text',
                            templet: function (data) {
                                return moneyFormat(data.money);
                            },
                        },
                        {
                            field: 'paymentMethod',
                            width: 120,
                            title: '付款方式',
                            edit: 'text',
                        },
                        {
                            field: 'remark',
                            title: '备注',
                            edit: 'text',
                        },
                        {
                            field: 'recordTime',
                            width: 160,
                            title: '记录时间',
                            edit: 'text',
                        },
                        {
                            title: '操作',
                            width: 180,
                            toolbar: '#currentTableBar2',
                            align: 'center',
                        },
                    ],
                ],
                data: [ // 静态数据
                    {
                        numbers: 1,
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    },
                    {
                        numbers: 2,
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    },
                    {
                        numbers: 3,
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    },
                    {
                        numbers: 4,
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    },
                    {
                        numbers: 5,
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    },
                ],
                done: function (res, curr, count) {
                    form.render(); // 刷新表格分页显示数据
                },
                // limits: [10, 20, 50, 120],
                // limit: 10,
                // page: false,
                // skin: 'line',
            });

            /**
             * 弹出层[添加][删除]等监听事件
             */
            table.on('toolbar(currentTableFilter2)', function (obj) {
                // 如果没有保存主数据则不允许点击添加或删除按钮
                // if (p_id == -1) {
                //     layer.msg('请先保存销售订单', {
                //         icon: 5,
                //         time: 1500,
                //     });
                //     return false;
                // }
                if (obj.event === 'add') {
                    // 监听添加操作，与lay-event="add"对应
                    // var index = layer.open({
                    //     id: 'addPage2', // 定义ID防止重复弹出
                    //     title: '添加销售订单收款记录', // 页面标题
                    //     type: 2, // 页面类型
                    //     shade: 0.2, // 遮罩背景透明度
                    //     maxmin: false, // 不显示最大化最小化按钮
                    //     shadeClose: true, // 显示关闭按钮
                    //     area: ['60%', '90%'], // 填充尺寸
                    //     content: '/page/order_sales_receipt/add.html?pid=' + p_id, // 打开的页面
                    // });

                    // var tabData = table.cache["#currentTableFilter2"];
                    // var newRow = {
                    //     money: '',
                    //     paymentMethod: '',
                    //     remark: '',
                    //     recordTime: ''
                    // };
                    // tabData.push(newRow);
                    // table.reload('#currentTableFilter2', {
                    //     data: tabData
                    // });

                    // var tabData = table.cache["#currentTableFilter2"];
                    table.addRow('#currentTableFilter2', {
                        money: '',
                        paymentMethod: '',
                        remark: '',
                        recordTime: ''
                    });
                    // tabData.push(newRow);
                    // table.reload('#currentTableFilter2', {
                    //     data: tabData
                    // });
                } else if (obj.event === 'delete') {
                    // 监听批量删除操作，与lay-event="delete"对应
                    var checkStatus = table.checkStatus('currentTable2');
                    var data = checkStatus.data;
                    var ids = []; // 需要删除的ID数组
                    for (let i = 0; i < data.length; i++) {
                        ids[i] = data[i].id;
                    }
                    if (ids.length == 0) {
                        return false; // 未选中任何行
                    } // Ajax调用后端接口批量删除数据
                    layer.confirm('真的批量删除么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.ordersalesreceipt.remove, // 后端批量删除接口地址
                            type: 'POST',
                            data: JSON.stringify(ids), // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            contentType: 'application/json', // 指定请求方式为JSON 
                            // headers: {
                            //     token: localStorage.token, // 接口请求头必须携带Token参数（登录后从本地存储中获取token） 
                            // },
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            }
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable2', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.ordersalesreceipt.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });

            // 点击编辑按钮
            table.on('tool(currentTableFilter2)', function (obj) {
                var data = obj.data;
                if (obj.event === 'edit') {
                    var index = layer.open({
                        id: 'editPage2', // 定义ID防止重复弹出
                        title: '编辑销售订单收款记录', // 页面标题
                        type: 2, // 页面类型
                        shade: 0.2, // 遮罩背景透明度
                        maxmin: false, // 不显示最大化最小化按钮
                        shadeClose: true, // 显示关闭按钮
                        area: ['60%', '90%'], // 填充尺寸
                        content: '/page/order_sales_receipt/edit.html?id=' + data.id, // 打开的页面
                    });
                    return false;
                } else if (obj.event === 'delete') {
                    layer.confirm('真的删除行么？', function (index) { // 通过Ajax根据id删除数据 
                        $.ajax({
                            url: $api.ordersalesreceipt.delete, // 后端删除接口地址
                            type: 'POST',
                            data: 'id=' + data.id, // 删除接口通过RequestParam方式传值 
                            dataType: 'JSON',
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1,
                                        time: 1000,
                                    });
                                } else {
                                    layer.msg('删除失败', {
                                        icon: 2,
                                        time: 1500,
                                    });
                                }
                            },
                            error: function (res) {
                                layer.msg('删除失败', {
                                    icon: 2,
                                    time: 1500,
                                });
                            },
                        });
                        // 删除数据后，执行搜索重载
                        table.reload('currentTable2', { // 分页对象，自动处理分页
                            where: {
                                type: p_id // 将新添加的主ID作为条件关联查询
                            }, // 查询的条件（可用Q请求参数类进行封装）
                            page: {
                                curr: 1,
                            },
                            url: $api.ordersalesreceipt.pagelist, // 后端分页查询接口地址
                            method: 'GET',
                        }, 'data');
                        layer.close(index);
                    });
                }
            });
        });
    </script>
</body>

</html>